<!DOCTYPE html>
<html>

<head>
    <meta charset="utf-8">
    <title>Cycle Time</title>
    <link rel="stylesheet" type="text/css" href="static/css/bootstrap.min.css" />
    <script src="static/js/echarts.min.js"></script>
</head>

<body>
    <div class="jumbotron text-center">
        <h1>Cycle Time</h1>
        <p>Show cycle logs in echarts</p>
    </div>
    <div class="row text-center">
        <div class="col-sm-4">
            <span class="fileupload fileupload-new" data-provides="fileupload" style="margin-left: 3px">
                <span class="btn btn-default btn-file">
                    <span class="fileupload">Upload Log Files</span>
                    <input type="file" id="log_files" multiple="mutiple" />
                </span>
            </span>
        </div>
        <div class="col-sm-3">
            <div class="form-group">
                <label class="control-label" for="line">Search Lines Match Regexp:</label>
                <input class="form-control" type="text" name="line" id="line" value="(Mon|Tue|Wed|Thu|Fri|Sat|Sun) .* CST [0-9]{4}">
            </div>
        </div>
        <div class="col-sm-3">
            <div class="form-group">
                <label class="control-label" for="time">Timestamp Regexp:</label>
                <input class="form-control" type="text" name="time" id="time" value="(Mon|Tue|Wed|Thu|Fri|Sat|Sun) .* CST [0-9]{4}">
            </div>
        </div>

        <div class="col-sm-1">
            <br/>
            <button class="btn btn-default" onclick="update_data()">Try Again</button>
        </div>
    </div>
    <div class="container text-center">

        <hr/>

        <div id="chart" style="width: 1000px;height:600px;"></div>
    </div>
</body>
<script src="cycle_time.js"></script>

</html>